<style>
  .pagination {
    justify-content: center;
  }
</style>
<!--页面主要内容-->
<main class="lyear-layout-content">

  <div class="container-fluid p-t-15">

    <div class="row">
      <div class="col-lg-12">
        <div class="card">
          <div class="card-toolbar d-flex flex-column flex-md-row">
            <div class="toolbar-btn-action">
              <a class="btn btn-primary m-r-5" href="{:url('admin/admin/add')}"><i class="mdi mdi-plus"></i> 新增</a>
              <a class="btn btn-success m-r-5" target-form="ids"><i class="mdi mdi-check"></i> 启用</a>
              <a class="btn btn-warning m-r-5"><i class="mdi mdi-block-helper"></i> 禁用</a>
              <a class="btn btn-danger"><i class="mdi mdi-window-close"></i> 删除</a>
            </div>

            <form class="search-bar ml-md-auto" method="get" role="form">
              <input type="hidden" name="search_field" id="search-field" value="username" />
              <div class="input-group ml-md-auto">
                  <div class="input-group-prepend">
                      <button class="btn btn-default dropdown-toggle" type="button" data-toggle="dropdown"
                          aria-haspopup="true" aria-expanded="false" id="search-btn">{$searchfield == 'username' ? '用户名' : '昵称'}</button>
                      <div class="dropdown-menu">
                          <a class="dropdown-item" href="javascript:void(0);" data-field="username">用户名</a>
                          <a class="dropdown-item" href="javascript:void(0);" data-field="nickname">昵称</a>
                      </div>
                  </div>
                  <input type="text" class="form-control" name="keyword" placeholder="请输入关键字" value="{$keyword}">
              </div>
          </form>
          </div>
          <div class="card-body">

            <div class="table-responsive">
              <table class="table table-bordered">
                <thead>
                  <tr>
                    <th>
                      <div class="custom-control custom-checkbox">
                        <input type="checkbox" class="custom-control-input" id="check-all">
                        <label class="custom-control-label" for="check-all"></label>
                      </div>
                    </th>
                    <th>编号</th>
                    <th>用户名</th>
                    <th>昵称</th>
                    <th>状态</th>
                    <th>操作</th>
                  </tr>
                </thead>
                <tbody>
                  {foreach $AdminList as $key => $item}
                  <tr>
                    <td>
                      <div class="custom-control custom-checkbox">
                        <input type="checkbox" class="custom-control-input ids" name="ids[]" value="{$item['id']}"
                          id="ids-{$item['id']}">
                        <label class="custom-control-label" for="ids-{$item['id']}"></label>
                      </div>
                    </td>
                    <td>{$key + ($page - 1) * $num + 1}</td>
                    <td>{$item['username']}</td>
                    <td>{$item['nickname']}</td>
                    <td>
                      <font class="{$item.state == 1 ? 'text-success' : 'text-danger'}">{$item.state == 1 ? '正常' : '禁用'}
                      </font>
                    </td>
                    <td>
                      <div class="btn-group">
                        <a class="btn btn-xs btn-default" href="{:url('admin/admin/edit',['adminid' => $item['id']])}"
                          data-toggle="tooltip" data-original-title="编辑"><i class="mdi mdi-pencil"></i></a>
                        <a class="btn btn-xs btn-default del" data-toggle="tooltip" data-adminid="{$item['id']}"
                          onclick="return confirm('确认删除账号？')" data-original-title="删除"><i
                            class="mdi mdi-window-close"></i></a>
                      </div>
                    </td>
                  </tr>
                  {/foreach}
                </tbody>
              </table>
            </div>
            <!-- 分页 -->
            {$AdminList|raw}
          </div>
        </div>
      </div>
    </div>
  </div>
</main>
<!--End 页面主要内容-->

<script>
  $('.search-bar .dropdown-menu a').click(function () {
    var field = $(this).data('field') || '';
    $('#search-field').val(field);
    $('#search-btn').html($(this).text());
  });
  function GetID() {
    var IdArr = []
    $('input[name="ids[]"]:checked').each(function (index, item) {
      IdArr.push(item.value)
    })
    return IdArr
  }
  // 启用
  $('.btn-success').click(function () {

    var ids = GetID()

    if (ids.length == 0) {
      $.notify({
        message: '请选择需要禁用的用户名',
      }, {
        type: 'warning'
      })
      return false
    }

    $.ajax({
      type: "post",
      url: `{:url('admin/admin/state')}`,
      data: {
        ids,
        action: 1
      },
      dataType: "json",
      success: function (res) {
        if (res.code === 1) {
          $.notify({
            message: res.msg
          }, {
            onClose: function () {
              location.reload()
            }
          })
        } else {
          $.notify({
            message: res.msg,
          }, {
            type: 'warning'
          })
        }
      }
    });
  })
  // 禁用
  $('.btn-warning').click(function () {
    var ids = GetID()

    if (ids.length == 0) {
      $.notify({
        message: '请选择需要启用的用户',
      }, {
        type: 'warning'
      })
      return false
    }

    $.ajax({
      type: "post",
      url: `{:url('admin/admin/state')}`,
      data: {
        ids,
        action: 0
      },
      dataType: "json",
      success: function (res) {
        if (res.code === 1) {
          $.notify({
            message: res.msg
          }, {
            onClose: function () {
              location.reload()
            }
          })
        } else {
          $.notify({
            message: res.msg,
          }, {
            type: 'warning'
          })
        }
      }
    });
  })
  // 删除
  $('.del').click(function(){
    var adminid =$(this).data('adminid')
    // console.log(adminid);
    $.ajax({
      type: "post",
      url: `{:url('admin/admin/del')}`,
      data: {
        action:'del',
        adminid
      },
      dataType: "json",
      success: function (res){
        if (res.code === 1) {
          $.notify({
            message: res.msg
          }, {
            onClose: function () {
              location.reload()
            }
          })
        } else {
          $.notify({
            message: res.msg,
          }, {
            type: 'warning'
          })
        }
      }
    })
  })
  // 批量删除
  $('.btn-danger').click(function(){
    var ids = GetID()
    if (ids.length == 0) {
      $.notify({
        message: '请选择需要删除的用户',
      }, {
        type: 'warning'
      })
      return false
    }
    $.ajax({
      type: "post",
      url: `{:url('admin/admin/del')}`,
      data: {
        action:'BatchDelete',
        ids
      },
      dataType: "json",
      success: function (res){
        if (res.code === 1) {
          $.notify({
            message: res.msg
          }, {
            onClose: function () {
              location.reload()
            }
          })
        } else {
          $.notify({
            message: res.msg,
          }, {
            type: 'warning'
          })
        }
      }
    })
  })
</script>